<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  <div id="test">
    <!-- 
        v-text: p.innerText = 动态值  将内容作为单纯文本插入到标签体
        v-html: p.innerHTML = 动态值  将内容作为html格式内容插入到标签体
    -->
    <p v-text="content">原本的内容</p>  
    <p v-html="content">原本的内容</p>

    <br>
    <!-- 插值语法, 相对于v-text更灵活: 可以是标签体部分文本 -->
    <p>abc{{content}}cba</p>  

  </div>

  <script src="../js/vue.js"></script>
  <script>
    new Vue({
      el: "#test",
      data: {
        content: '<a href="http:/www.baidu.com">去百度</a>'
      }
    })
  </script>
</body>
</html>